<template>
    <fieldset>
        <legend>购物车</legend>
        <h1>购物车：catr</h1>
        <ul>
            <li v-for="item in catrData" :key="item.id">
                <b>产品：{{item.title}}</b>
                <b>价格：{{item.price}}</b>
                <b>数量：{{item.count}}</b>
                <button @click="remove(item)">-</button>
            </li>
        </ul>
        <h1>总价：{{total}}</h1>
    </fieldset>
</template>
<script>
import { mapMutations, mapState,mapActions,mapGetters} from 'vuex'
export default {
computed:{
    ...mapState('catr',['catrData']),
    ...mapGetters('catr',['total'])
},
methods:{
    ...mapMutations('catr',['LOG']),
    ...mapActions('catr',['RE_CATR']),
    remove(item){
        this.RE_CATR(item)
    }
}
}
</script>
